<template>
	<view>
		<view :class="loader">
			<view class="cover" @click="onClickCover"></view>
			<view class="body">
				小提示
				<view v-text="info.notice" style="text-align: left;margin-top: 20rpx;"></view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			info:{
				type:Object,
				default:{}
			}
		},
		data(){
			return {
				loader:'load'
			}
		},
		methods:{
			onClickCover(){
				const that=this;
				that.loader="destroy";
				setTimeout(function(){
					that.$emit('onClickCover');
				},310);
				
			}
		}
	}
</script>

<style scoped>
	.load{
		animation: load 0.3s linear;
	}
	.destroy{
		opacity: 0;
		animation: destroy 0.3s linear;
	}
	.cover{
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0rpx;
		left: 0rpx;
		opacity: 0.5;
		z-index: 1;
		background-color: #999999;
	}
	.body{
		
		width: 500rpx;
		height: 300rpx;
		padding: 50rpx;
		position: fixed;
		top: 50%;
		margin-top: -200rpx;
		left: 50%;
		z-index: 2;
		margin-left: -300rpx;
		background-color: #EAEAEA;
		border-radius: 50rpx;
		text-align: center;
		font-weight: 800;
		color: #555555;
	}
</style>
